<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="component/pageHead.jsp"%>
<!doctype html>
<html class="no-js" lang="zxx">
<head>
    <base href="<%=basePath%>"/>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Parlo - eCommerce Bootstrap 4 Template</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1"><!-- Favicon -->
    <link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.png">
    <!-- CSS	============================================ --><!-- Bootstrap CSS -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css"><!-- Icon Font CSS -->
    <link rel="stylesheet" href="assets/css/icons.min.css"><!-- Plugins CSS -->
    <link rel="stylesheet" href="assets/css/plugins.css"><!-- Main Style CSS -->
    <link rel="stylesheet" href="assets/css/style.css"><!-- Modernizer JS -->
    <script src="assets/js/vendor/modernizr-2.8.3.min.js"></script>
    <%--    vue--%>
    <script src="assets/js/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<jsp:include page="component/head.jsp"></jsp:include>
<div class="wrapper">


    <div class="breadcrumb-area pt-35 pb-35 bg-gray">
        <div class="container">
            <div class="breadcrumb-content text-center">
                <ul>
                    <li><a href="<%=path%>/front/index.jsp">主页</a></li>
                    <li class="active">商品列表</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="shop-area pt-95 pb-100">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="shop-bottom-area mt-35">
                        <div class="tab-content jump">

                            <div id="shop-2" class="tab-pane active">

                                <c:forEach var="item" items="${list}">
                                    <div class="shop-list-wrap shop-list-mrg2 mb-30">
                                        <div class="row">
                                            <div class="col-lg-4 col-md-4">
                                                <div class="product-list-img"><a href="/furniture/furniture/details?furnitureId=${item.furnitureId}"><img
                                                        src="${item.furnitureImg}"
                                                        alt="Universal Product Style"></a>
                                                    <div class="product-quickview"><a href="#" title="Quick View"
                                                                                      data-toggle="modal"
                                                                                      data-target="#exampleModal"><i
                                                            class="sli sli-magnifier-add"></i></a></div>
                                                </div>
                                            </div>
                                            <div class="col-lg-8 col-md-8 align-self-center">
                                                <div class="shop-list-content"><h3><a href="/furniture/furniture/details?furnitureId=${item.furnitureId}">${item.furnitureName}</a></h3>
                                                    <p>${item.describe}</p><span>${item.categoryName}</span>
                                                    <div class="shop-list-price-action-wrap">
                                                        <div class="shop-list-price-ratting">
                                                            <div class="ht-product-list-price"><span
                                                                    class="new">$ ${item.price}</span><span class="old">$ ${item.price*1.2}</span>
                                                            </div>
                                                            <div class="ht-product-list-ratting"><i
                                                                class="sli sli-star"></i><i class="sli sli-star"></i><i
                                                                class="sli sli-star"></i><i class="sli sli-star"></i><i
                                                                class="sli sli-star"></i></div>
                                                        </div>

                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer class="footer-area bg-paleturquoise">
        <div class="container">
            <div class="footer-top text-center pt-45 pb-45">
                <nav>
                    <ul>
                        <li><a href="#">Home </a></li>
                        <li><a href="#">Shop </a></li>
                        <li><a href="#">Accessories </a></li>
                        <li><a href="#">Contact </a></li>
                        <li><a href="#">About </a></li>
                        <li><a href="#">Blog </a></li>
                    </ul>
                </nav>
            </div>
        </div>
        <div class="footer-bottom border-top-1 pt-20">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-4 col-md-5 col-12">
                        <div class="footer-social pb-20"><a href="#">Facebok</a><a href="#">Twitter</a><a href="#">Linkedin</a><a
                                href="#">Instagram</a></div>
                    </div>
                    <div class="col-lg-4 col-md-4 col-12">
                        <div class="copyright text-center pb-20"><p>Copyright Â© All Right <a
                                href="http://www.bootstrapmb.com/" title="bootstrapmb">Reserved</a></p></div>
                    </div>
                    <div class="col-lg-4 col-md-3 col-12">
                        <div class="payment-mathod pb-20"><a href="#"><img src="assets/img/icon-img/payment.png" alt=""></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    </div><!-- All JS is here============================================ --><!-- jQuery JS -->
<script src="assets/js/vendor/jquery-1.12.4.min.js"></script><!-- Popper JS -->
<script src="assets/js/popper.min.js"></script><!-- Bootstrap JS -->
<script src="assets/js/bootstrap.min.js"></script><!-- Plugins JS -->
<script src="assets/js/plugins.js"></script><!-- Ajax Mail -->
<script src="assets/js/ajax-mail.js"></script><!-- Main JS -->
<script src="assets/js/main.js"></script>
</body>
</html>